<template>
    <div id="orderSearchDiv">
        <div id="dataViewDiv">
            <div>
                <el-radio-group v-model="dataViewDate" @change="queryTradeOrderTotal()">
                    <el-radio-button label="1">今天</el-radio-button>
                    <el-radio-button label="2">最近三天</el-radio-button>
                    <el-radio-button label="3">最近七天</el-radio-button>
                    <el-radio-button label="4" class="el-radio-button-inner-datepicker">
                        <el-date-picker
                            v-model="dataViewRange"
                            type="daterange"
                            align="right"
                            unlink-panels
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                            value-format="yyyy-MM-dd"
                            :picker-options="pickerOptions"
                            @focus="focusPickerDate"
                            @blur="changeDataViewDate"
                            @change="changeDataViewDate"
                        ></el-date-picker>
                    </el-radio-button>
                </el-radio-group>
            </div>
            <div style="margin-top:20px;">
                <div id="order_total_flex">
                    <div class="total_row_item">
                        <div class="order_content">
                            <div class="order_total_title">付款单（笔）</div>
                            <div class="order_total_info">
                                <span class="order_data">{{ totalData.payOrderNum }}</span>
                            </div>
                        </div>
                        <div class="order_detail">
                            <div class="order_content2">
                                <div class="order_total_title">已完成</div>
                                <div class="order_total_info">
                                    <span class="order_data">{{ totalData.orderFinishNum }}</span>
                                </div>
                            </div>
                            <div class="order_content2">
                                <div class="order_total_title">待收货</div>
                                <div class="order_total_info">
                                    <span class="order_data">{{ totalData.orderAcceptNum }}</span>
                                </div>
                            </div>
                            <div class="order_content2">
                                <div class="order_total_title">待发货</div>
                                <div class="order_total_info">
                                    <span class="order_data">{{ totalData.orderPostNum }}</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="total_row_item">
                        <div class="order_content">
                            <div class="order_total_title">付款金额（元）</div>
                            <div class="order_total_info">
                                <span class="order_data">{{ totalData.payMoney }}</span>
                            </div>
                        </div>
                    </div>
                    <div class="total_row_item">
                        <div class="order_content">
                            <div class="order_total_title">退款单（笔）</div>
                            <div class="order_total_info">
                                <span class="order_data">{{ totalData.returnOrderNum }}</span>
                            </div>
                        </div>
                    </div>
                    <div class="total_row_item">
                        <div class="order_content">
                            <div class="order_total_title">用户退款金额（元）</div>
                            <div class="order_total_info">
                                <span class="order_data">{{ totalData.returnMoney }}</span>
                            </div>
                        </div>
                    </div>
                    <div class="total_row_item">
                        <div class="order_content">
                            <div class="order_total_title">付款用户数（人）</div>
                            <div class="order_total_info">
                                <span class="order_data">{{ totalData.payerNum }}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="form1" style="text-align:center;margin-top:30px;margin-left:35px;">
            <el-form
                :inline="true"
                :model="formInline"
                class="demo-form-inline"
                @keyup.enter.native="search()"
                id="orderSearchForm"
            >
            
<<<<<<< HEAD
                <el-form-item label="　　订单编号：">
                  <br> <br>
                    <el-input v-model="formInline.orderNo" placeholder style="margin-left:-70px"></el-input>
                </el-form-item>
               <el-form-item label="　店铺授权码：" style="margin-left:20px">
                                      <br> <br>
                    <el-input v-model="formInline.authCode" placeholder style="margin-left:-90px"></el-input>
                </el-form-item>
                <el-form-item label="经销商公司名称：" style="margin-left:60px">
                   <br> <br>
                    <el-input v-model="formInline.companyName" placeholder style="margin-left:-110px"></el-input>
                </el-form-item>
                   <el-form-item label="　　商品名称：" style="margin-left:10px">
                   <br> <br>
                    <el-input v-model="formInline.goodsName" placeholder style="margin-left:-80px"></el-input>
=======
                <el-form-item label="　　订单编号">
                  <br> <br>
                    <el-input v-model="formInline.orderNo" placeholder style="margin-left:-70px;width:200px"></el-input>
                </el-form-item>
               <el-form-item label="　店铺授权码" style="margin-left:-40px">
                                      <br> <br>
                    <el-input v-model="formInline.authCode" placeholder style="margin-left:-90px;width:200px"></el-input>
                </el-form-item>
                <el-form-item label="经销商公司名称" style="margin-left:-50px">
                   <br> <br>
                    <el-input v-model="formInline.companyName" placeholder style="margin-left:-110px;width:200px"></el-input>
                </el-form-item>
                   <el-form-item label="　　商品名称" style="margin-left:-85px">
                   <br> <br>
                    <el-input v-model="formInline.goodsName" placeholder style="margin-left:-80px;width:200px"></el-input>
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                </el-form-item>
                <!-- <el-form-item label="　退货状态：">
          <el-select v-model="formInline.returnStatus" placeholder="请选择" clearable>
            <el-option v-for="(item,i) in returnStatusList"
              :key="i"
              :value="item.id"
              :label="item.name"
            ></el-option>
          </el-select>
                </el-form-item>-->
               
<<<<<<< HEAD
                <br />
                <el-form-item label="　　店铺名称：">
                   <br> <br>
                    <el-input v-model="formInline.storeName" placeholder   style="margin-left:-70px"></el-input>
                </el-form-item>
                <el-form-item label="　　店主姓名：">
                   <br> <br>
                    <el-input v-model="formInline.shopOwnerName" placeholder style="margin-left:-70px"></el-input>
                </el-form-item>
                <el-form-item label="　　大区名称：" v-if="orgType == 1 || orgType == 2" style="margin-left:50px">
                   <br> <br>
                    <el-input v-model="formInline.warzoneName" placeholder style="margin-left:-70px"></el-input>
                </el-form-item>
                <el-form-item label="　　营销区域名称：" v-if="orgType == 1 || orgType == 2 || orgType == 3" style="margin-left:40px">
                                    <br> <br>
                    <el-input v-model="formInline.baseName" placeholder style="margin-left:-70px"></el-input>
                </el-form-item>
                <br />
=======
              
                <el-form-item label="　　店铺名称" style="margin-left:-65px">
                   <br> <br>
                    <el-input v-model="formInline.storeName" placeholder   style="margin-left:-70px;width:200px"></el-input>
                </el-form-item>
                  <br />
                <el-form-item label="　　店主姓名">
                   <br> <br>
                    <el-input v-model="formInline.shopOwnerName" placeholder style="margin-left:-70px;width:200px"></el-input>
                </el-form-item>
                <el-form-item label="　　大区名称" v-if="orgType == 1 || orgType == 2" style="margin-left:-60px">
                   <br> <br>
                    <el-input v-model="formInline.warzoneName" placeholder style="margin-left:-70px;width:200px"></el-input>
                </el-form-item>
                <el-form-item label="　　营销区域名称" v-if="orgType == 1 || orgType == 2 || orgType == 3" style="margin-left:-60px">
                                    <br> <br>
                    <el-input v-model="formInline.baseName" placeholder style="margin-left:-70px;width:200px"></el-input>
                </el-form-item>
              
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                <!--
        <el-form-item label="　　会员等级：">
          <el-select v-model="formInline.gradelevelId" placeholder="请选择" clearable>
            <el-option v-for="(send,i) in gradelevelOptions" 
              :key="i" 
              :value="send.uuid" 
              :label="send.gradelevelName"
            ></el-option>
          </el-select>
        </el-form-item>
                -->
<<<<<<< HEAD
                <el-form-item label="　　会员姓名：">
                    <br> <br>
                    <el-input v-model="formInline.memberName" placeholder style="margin-left:-70px"></el-input>
                </el-form-item>
                <el-form-item label="　会员手机号：">
                    <br> <br>
                    <el-input v-model="formInline.memberPhone" placeholder style="margin-left:-70px"></el-input>
                </el-form-item>
                <el-form-item label="　　支付类型："  style="margin-left:50px">
=======
                <el-form-item label="　　会员姓名"  style="margin-left:-55px">
                    <br> <br>
                    <el-input v-model="formInline.memberName" placeholder style="margin-left:-70px;width:200px"></el-input>
                </el-form-item>
                <el-form-item label="　会员手机号"  style="margin-left:-55px">
                    <br> <br>
                    <el-input v-model="formInline.memberPhone" placeholder style="margin-left:-70px;width:200px"></el-input>
                </el-form-item>
                  <br />
                <el-form-item label="　　支付类型"  style="margin-left:-5px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                    <br> <br>
                    <el-select v-model="formInline.payMethod" placeholder="请选择" clearable style="margin-left:-70px">
                        <el-option
                            v-for="(item,i) in payMethodList"
                            :key="i"
                            :value="item.id"
                            :label="item.name"
                        ></el-option>
                    </el-select>
                </el-form-item>
<<<<<<< HEAD
                <el-form-item label="　　配送方式："  style="margin-left:50px">
=======
                <el-form-item label="　　配送方式"  style="margin-left:-60px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                    <br> <br>
                    <el-select v-model="formInline.deliveryMethod" placeholder="请选择" clearable style="margin-left:-70px">
                        <el-option
                            v-for="(item,i) in deliveryMethodList"
                            :key="i"
                            :value="item.id"
                            :label="item.name"
                        ></el-option>
                    </el-select>
                </el-form-item>
<<<<<<< HEAD
                <br />
                <div v-show="isActive">
             
                 <el-form-item label="　　订单状态：">
=======
             
               
             
                 <el-form-item label="　　订单状态" style="margin-left:-55px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                  <br> <br>
                    <el-select v-model="formInline.orderStatus" placeholder="请选择" clearable style="margin-left:-70px">
                        <el-option
                            v-for="(item,i) in orderStatusList"
                            :key="i"
                            :value="item.id"
                            :label="item.name"
                        ></el-option>
                    </el-select>
                </el-form-item>
<<<<<<< HEAD
                <el-form-item label="是否包含限购品："  style="margin-left:20px">
=======
                <el-form-item label="是否包含限购品"  style="margin-left:-30px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                                      <br> <br>
                    <el-select
                        v-model="formInline.isBuyLimit"
                        placeholder="请选择"
                        clearable
                        style="margin-left:-110px"
                    >
                        <el-option label="是" value="1"></el-option>
                        <el-option label="否" value="0"></el-option>
                    </el-select>
                </el-form-item>
<<<<<<< HEAD
                    <el-form-item label="是否包含宴席信息："  style="margin-left:30px">
=======
                    <el-form-item label="是否包含宴席信息"  style="margin-left:-80px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                                      <br> <br>
                    <el-select v-model="formInline.isFeastOrder" placeholder="请选择" clearable style="margin-left:-110px">
                        <el-option label="是" value="1"></el-option>
                        <el-option label="否" value="0"></el-option>
                    </el-select>
                </el-form-item>
<<<<<<< HEAD
                <el-form-item label="是否包含赠品：" style="margin-left:20px;" >
=======
                   <br />
                    <span v-show="isActive">
                <el-form-item label="是否包含赠品" style="margin-left:20px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                                      <br> <br>
                    <el-select v-model="formInline.isGiftOrder" placeholder="请选择" clearable style="margin-left:-100px">
                        <el-option label="是" value="1"></el-option>
                        <el-option label="否" value="0"></el-option>
                    </el-select>
                </el-form-item>
<<<<<<< HEAD
            
                <br />
             
                <el-form-item label="　　商品类型：">
=======
               <el-form-item label="　　商品类型" style="margin-left:-80px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                   <br> <br>
                    <el-select v-model="formInline.goodsStyle" placeholder="请选择" clearable style="margin-left:-80px">
                        <el-option label="普通商品" value="1"></el-option>
                        <el-option label="宴席商品" value="2"></el-option>
                        <el-option label="生日专属商品" value="3"></el-option>
                    </el-select>
                </el-form-item>
<<<<<<< HEAD
                <el-form-item label="　　付款日期："  >
=======
                 
                <el-form-item label="　　付款日期"  style="margin-left:-55px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                   <br> <br>
                    <el-date-picker
                        v-model="formInline.payDateRange"
                     
                        type="daterange"
                        align="right"
                        unlink-panels
                        range-separator="至"
<<<<<<< HEAD
                         style="margin-left:-80px;width:560px;"
=======
                         style="margin-left:-80px;width:430px;"
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :picker-options="pickerOptions"
                    ></el-date-picker>
                </el-form-item>
<<<<<<< HEAD
                
                <br />
                <el-form-item label="　　发货日期：" >
=======
                <br />
             
            
                
                
                <el-form-item label="　　发货日期" style="margin-left:-15px">
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                   <br> <br>
                    <el-date-picker
                        v-model="formInline.fhDateRange"
                        type="daterange"
                        align="right"
<<<<<<< HEAD
                        style="margin-left:-90px;width:560px;"
=======
                        style="margin-left:-70px;width:430px;"
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                        unlink-panels
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :picker-options="pickerOptions"
                    ></el-date-picker>
                </el-form-item>

<<<<<<< HEAD
                 <el-form-item label="　　下单日期：">
                   <br> <br>
                    <el-date-picker
                        v-model="formInline.dateRange"
                        style="margin-left:260px;width:560px;"
=======
                 <el-form-item label="下单日期"  style="margin-left:195px">
                   <br> <br>
                    <el-date-picker
                        v-model="formInline.dateRange"
                        style="margin-left:-70px;width:430px;"
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                        type="daterange"
                        align="right"
                        unlink-panels
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :picker-options="pickerOptions"
                    ></el-date-picker>
                </el-form-item>
<<<<<<< HEAD
                 </div>
=======
                 </span>
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
                <div id="multiBtnDiv" style="display:block;text-align:right;margin:20px 0">
                   <el-button @click="isActive = !isActive" type="primary" size="mini" v-if="!isActive">筛选条件展开</el-button>
                    <el-button @click="isActive = !isActive" type="primary" size="mini" v-if="isActive">筛选条件折叠</el-button>
                    <el-button type="primary" @click="search()" size="mini" icon="el-icon-search"    :disabled="dindanflagone">查询</el-button>
                    <el-button type="primary" @click="kong()" size="mini" icon="el-icon-delete">清空</el-button>
                    <el-button
                        type="success"
                        @click="exportExcel()"
                        size="mini"
                        icon="el-icon-s-data"
                        :loading="exportLoading"
                    >导出</el-button>
                    <el-button
                        type="primary"
                        @click="showConfigTableDialog()"
                        size="mini"
                        icon="el-icon-setting"
                        :loading="insertLoading"
                    >列表配置</el-button>
                </div>
            </el-form>
        </div>
        <div class="table1">
            <el-table
                id="rebateSetTable"
                ref="table1"
                height="500px"
                key="table1"
                tooltip-effect="dark"
                v-loading="loading"
           
                :data="tableData"
                border
                :header-cell-style="{background:'#eef1f6',color:'#606266'}"
                @sort-change="handleSort"
            >
                <el-table-column type="index" label="序号" align="center" width="60" ></el-table-column>
                <el-table-column 
                  v-for="(item, index) in col" 
                  :key="`col_${index}`" 
                  :prop="dropCol[index].prop" 
                  :width="dropCol[index].width" 
                  :min-width="200"
                  :label="item.label"
                  :sortable="item.sortable"
                  align="center"
                >
                  <template slot-scope="scope">
                    <div v-if="dropCol[index].prop === 'picList'">
                      <img
                        :src="scope.row.picList[0]"
                        v-if="scope.row.picList !=null && scope.row.picList.length > 0"
                        width="70"
                        height="50"
                        @click="showGoodsPicDialog(scope.row)"
                        title="点击查看"
                      />
                      <span v-if="scope.row.picList != null && scope.row.picList.length > 1">…</span>
                      <span v-if="scope.row.picList == null || scope.row.picList.length == 0">无</span>
                    </div>
                    <div v-if="dropCol[index].prop === 'feastList'">
                      <div v-if="scope.row.feastList != null && scope.row.feastList.length > 0">
                          <div v-for="feastItem in scope.row.feastList" :key="feastItem.uuid">
                              <div>{{feastItem.feastDate}}</div>
                              <div>{{feastItem.feastAddressDetail}}</div>
                          </div>
                      </div>
                      <span v-if="scope.row.feastList == null || scope.row.feastList.length == 0">无</span>
                    </div>
                    <div v-if="dropCol[index].prop != 'feastList' && dropCol[index].prop != 'picList'">
                      {{scope.row[dropCol[index].prop]}}
                    </div>
                  </template>
                </el-table-column>
                <!--
                <el-table-column
                    prop="orderNo"
                    label="订单编号"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('orderNo')"
                ></el-table-column>
                <el-table-column
                    prop="goodsNames"
                    label="商品名称"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('goodsNames')"
                ></el-table-column>
                <el-table-column
                    prop="totalAmount"
                    label="商品数量"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('totalAmount')"
                ></el-table-column>
                <el-table-column
                    prop="haveBuyLimitName"
                    label="是否包含限购品"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('haveBuyLimitName')"
                ></el-table-column>
                <el-table-column
                    prop="haveGiftOrderName"
                    label="是否包含赠品"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('haveGiftOrderName')"
                ></el-table-column>
                <el-table-column
                    prop="memberName"
                    label="会员姓名"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('memberName')"
                ></el-table-column>
                <el-table-column
                    prop="nickName"
                    label="备注名称"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('nickName')"
                ></el-table-column>
                <el-table-column
                    prop="gradelevelName"
                    label="会员等级"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('gradelevelName')"
                ></el-table-column>
                <el-table-column
                    prop="memberPhone"
                    label="会员手机号"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('memberPhone')"
                ></el-table-column>
                <el-table-column
                    prop="warzoneName"
                    label="大区名称"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('warzoneName')"
                ></el-table-column>
                <el-table-column
                    prop="baseName"
                    label="营销区域名称"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('baseName')"
                ></el-table-column>
                <el-table-column
                    prop="storeName"
                    label="店铺名称"
                    align="left"
                    show-overflow-tooltip
                    v-if="isShow('storeName')"
                ></el-table-column>
                <el-table-column
                    prop="authCode"
                    label="店铺授权码"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('authCode')"
                ></el-table-column>
                <el-table-column
                    prop="storeAddress"
                    label="店铺地址"
                    align="left"
                    show-overflow-tooltip
                    v-if="isShow('storeAddress')"
                ></el-table-column>
                <el-table-column
                    prop="shopOwnerName"
                    label="店主姓名"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('shopOwnerName')"
                ></el-table-column>
                <el-table-column
                    prop="payMoney"
                    label="订单实付金额"
                    align="right"
                    :formatter="fixData"
                    v-if="isShow('payMoney')"
                ></el-table-column>
                <el-table-column
                    prop="orderTime"
                    label="下单时间"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('orderTime')"
                ></el-table-column>
                <el-table-column
                    prop="postPerson"
                    label="收货人姓名"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('postPerson')"
                ></el-table-column>
                <el-table-column
                    prop="postPersonTel"
                    label="收货人电话"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('postPersonTel')"
                ></el-table-column>
                <el-table-column
                    prop="postAddress"
                    label="收货地址"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('postAddress')"
                ></el-table-column>
                <el-table-column
                    prop="feastList"
                    label="宴席信息"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('feastList')"
                >
                    <template slot-scope="scope">
                        <div v-if="scope.row.feastList != null && scope.row.feastList.length > 0">
                            <div v-for="feastItem in scope.row.feastList" :key="feastItem.uuid">
                                <div>{{feastItem.feastDate}}</div>
                                <div>{{feastItem.feastAddressDetail}}</div>
                            </div>
                        </div>
                        <span
                            v-if="scope.row.feastList == null || scope.row.feastList.length == 0"
                        >无</span>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="payMethodName"
                    label="支付类型"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('payMethodName')"
                ></el-table-column>
                <el-table-column
                    prop="orderSourceName"
                    label="订单来源"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('orderSourceName')"
                ></el-table-column>
                <el-table-column
                    prop="orderStatusName"
                    label="订单状态"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('orderStatusName')"
                ></el-table-column>
                -->
                <el-table-column label="操作" align="center" fixed="right">
                    <template slot-scope="scope">
                        <el-button size="mini" @click="showOrderDetail(scope.row)" type="text">查看</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-form :inline="true" :model="formInline">
                <el-form-item style="margin-top: 0px;"></el-form-item>
            </el-form>
            <div class="block" style="margin-top:-22px">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :disabled="dindanflag"
                    :page-sizes="[10, 20, 30, 50, 100, 150, 200]"
                    :current-page="listQuery.current"
                    :page-size="listQuery.size"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total"
                ></el-pagination>
            </div>
        </div>

        <!--列表配置-->
        <el-dialog
            title="列表配置"
            :visible.sync="configTableDialogVisible"
            width="50%"
            @close="closeConfigTableDialog()"
        >
            <div id="configTableDiv">
                <el-form :inline="true" :model="formInline2" class="demo-form-inline">
                    <el-form-item label="选择列表字段：">
                        <el-checkbox
                            :indeterminate="formInline2.isIndeterminate"
                            v-model="formInline2.isAll"
                            style="margin-top:10px;"
                            @change="isAllFieldChange"
                        >全选</el-checkbox>
                    </el-form-item>
                    <el-divider></el-divider>
                    <el-checkbox-group v-model="userMenuShowFields" @change="isSingleFieldChange">
                        <el-checkbox
                            v-for="item in userMenuFieldList"
                            :label="item.fieldCode"
                            :key="item.fieldCode"
                            style="margin:15px 10px;width:120px;"
                        >{{item.fieldName}}</el-checkbox>
                    </el-checkbox-group>
                </el-form>
                <el-row>
                    <el-col :span="24" style="text-align: center;margin-top: 30px">
                        <el-button type="info" @click="closeConfigTableDialog()" size="mini">取 消</el-button>
                        <el-button type="primary" @click="insertUserFieldRelation()" size="mini">确 认</el-button>
                    </el-col>
                </el-row>
            </div>
        </el-dialog>

        <!--商品图片弹窗-->
        <el-dialog title="商品图片" :visible.sync="goodsPicDialoVisible" width="31%">
          <div>
            <el-form :inline="true" class="demo-form-inline">
              <el-row>
                <el-col>
                  <img v-for="(item, i) in picList" :key="i"
                    :src="item"
                    width="150"
                    height="120"
                    style="margin-left:10px"
                    @click="handlePreview(item)"
                    title="点击查看"
                  />
                </el-col>
              </el-row>
            </el-form>
          </div>
        </el-dialog>

        <!--图片预览弹窗-->
        <el-dialog :visible.sync="dialogVisibleImg" size="tiny">
          <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>
    </div>
</template>

<script>
import Sortable from 'sortablejs';
import {getmemberrule} from "@/api/membergrade";
import collapse from "@/utils/collapse.js";
import {
  queryTradeOrderTotal,
  queryTradeOrderByParam,
  queryTradeOrderByParamNoPage,
  excelTradeOrderByParam,
  queryTradeOrderPayInfo,
  queryTradeOrderItemList,
  queryUserMenuFieldByParam,
  insertUserFieldRelation
} from "@/api/tradeOrderSearch";
import qs from "qs";
import FileSaver from 'file-saver';
import XLSX from 'xlsx';

const curDateStr = function (){
  var curDate = new Date();
  var year = curDate.getFullYear();
  var month = curDate.getMonth() + 1;
  month = month > 9 ? month : "0" + month;
  var date = curDate.getDate();
  date = date > 9 ? date : "0" + date;
  return year + "-" + month + "-" + date;
}
export default {
  data() {
    return {
      logininfo: "",
      orgSeq: "",
      dindanflag:false,
       dindanflagone:false,
      orgType: "",
      loading: true,
      exportLoading: false,
      insertLoading: false,
      goodsPicDialoVisible: false,
       isActive: false,
      dialogVisibleImg: false,
      dialogImageUrl: "",
      picList: [],
      dataViewDate: "1",
      dataViewRange: "",
      totalData: {
        orderNum: 0,
        payOrderNum: 0,
        returnOrderNum: 0,
        orderFinishNum: 0,
        orderAcceptNum: 0,
        orderPostNum: 0,
        orderCancelNum: 0,
        payMoney: 0,
        returnMoney: 0,
        payerNum: 0
      },
      orderStatusList:[{
        id: '0',
        name: '待支付'
      },{
        id: '1',
        name: '待发货'
      },{
        id: '2',
        name: '待收货'
      }, {
        id: '3',
        name: '已完成'
      }, {
        id: '-1',
        name: '已退款'
      }],//订单状态
      returnStatusList:[{
        id: '0',
        name: '正常单'
      },{
        id: '1',
        name: '被退货单'
      },{
        id: '2',
        name: '退货单'
      }],//退货状态
      payMethodList: [{
        id: '0',
        name: '云店线下'
      },{
        id: '1',
        name: '线上支付'
      },{
        id: '2',
        name: 'pos线下支付'
      }, {
        id: '3',
        name: '微信'
      }, {
        id: '4',
        name: '支付宝'
      }, {
        id: '5',
        name: '银行卡'
      }],
      deliveryMethodList: [{
        id: '1',
        name: '门店自提'
      },{
        id: '2',
        name: '配送服务'
      },{
        id: '3',
        name: '快递服务'
      }],//配送方式
      gradelevelOptions: [],//会员等级
      formInline: {
        sortList:[],
        orderNo: "",
        orderStatus: "",
        companyName: "",
        returnStatus: "",
        customizeStatus: "",
        dateRange: "",
        payDateRange: "",
        fhDateRange: "",
        shopId: "",
        storeName: "",
        shopOwnerName: "",
        warzoneId: "",
        warzoneName: "",
        baseId: "",
        baseName: "",
        gradelevelId: "",
        memberName: "",
        memberPhone: "",
        goodsName: "",
        payMethod: "",
        deliveryMethod: "",
        authCode: "",
        isBuyLimit: "",
        isGiftOrder: "",
        isFeastOrder: "",
        goodsStyle: "",
      },
      allCol: [],
      col: [],
      dropCol: [],
      expandRowKeys: [],
      tableData: [],//订单列表数据
      tableDataExcel: [],//导出数据
      payData: [],//支付列表数据
      itemData: [],//商品列表数据
      total: 0,
      listQuery: {
        current: 1,
        size: 100
      },
      sort: "",
      order: "",
      configTableDialogVisible: false,//列表配置弹窗状态
      formInline2: {
        isIndeterminate: false,//是否半选中
        isAll: true,//是否全部显示,
        menuCode: "normalOrderSearch"
      },
      userMenuFieldList: [],//全部列名列表
      userMenuAllFields: [],//全部的列名
      userMenuShowFields: [],//显示的列名
      userOldMenuShowFields: [],//原显示的列名
      pickerOptions: {
        shortcuts: [
          {
            text: "最近3天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          }
        ],
        /*
        onPick: ({ maxDate, minDate }) => {
          this.pickerMinDate = minDate.getTime()
          if (maxDate) {
            this.pickerMinDate = ''
          }
        },
        disabledDate: (time) => {
          if (this.pickerMinDate !== '') {
            const day30 = 30 * 24 * 3600 * 1000
            let maxTime = this.pickerMinDate + day30
            if (maxTime > new Date()) {
              maxTime = new Date()
            }
            return time.getTime() > maxTime
          }
          return time.getTime() > Date.now()
        }
        */
      },
      
    };
  },
   components: {
  collapse
 },
  mounted() {
    this.logininfo = localStorage.getItem("logininfo");
    let orgJson = JSON.parse(this.logininfo);
    if (
      orgJson != null &&
      orgJson.orgList != null &&
      orgJson.orgList.length > 0
    ) {
      this.orgSeq = orgJson.orgList[0].orgSeq;
      this.orgType = orgJson.orgList[0].orgType;
    }
    if(this.orgType == 2){//大区
      this.formInline.warzoneId = this.orgSeq;
    }else if(this.orgType == 3){//营销区域
      this.formInline.baseId = this.orgSeq;
    }else if(this.orgType == 4){//门店
      this.formInline.shopId = this.orgSeq;
    }
    this.queryUserMenuFieldByParam();//加载列表配置字段
    this._getmemberinfo();//加载等级

    var orderSearchParam = sessionStorage.getItem("orderSearchParam");
    var pageFrom = sessionStorage.getItem("pageFrom");
    if(orderSearchParam != null && pageFrom == "normalOrderDetail"){
      orderSearchParam = JSON.parse(orderSearchParam);
      this.formInline = orderSearchParam.formInline;
      this.listQuery = orderSearchParam.listQuery;
      this.total = orderSearchParam.total;
    }
    sessionStorage.removeItem("orderSearchParam");
    sessionStorage.removeItem("pageFrom");
    this.queryTradeOrderTotal();//加载看板头部信息
    this.queryTradeOrderByParam();//加载订单列表
    document.body.ondrop = function(event) {
      event.preventDefault();
      event.stopPropagation();
    };
    // this.rowDrop()
    this.columnDrop();
  },
  filters: {
    numFilter(value) {
      let realVal = "";
      if (!isNaN(value) && value !== "") {
        // 截取当前数据到小数点后2位
        realVal = parseFloat(value).toFixed(2);
      } else {
        realVal = "--";
      }
      return realVal;
    }
  },
  methods: {
    //拖拽列表
    columnDrop() {
      const wrapperTr = document.querySelector('.el-table__header-wrapper tr');
      this.sortable = Sortable.create(wrapperTr, {
        animation: 180,
        delay: 0,
        onEnd: evt => {
          const oldItem = this.dropCol[evt.oldIndex-1];
          this.dropCol.splice(evt.oldIndex-1, 1);
          this.dropCol.splice(evt.newIndex-1, 0, oldItem);
        }
      });
    },
    //客户等级获取
    _getmemberinfo() {
      let data = {
        size: 99,
        current: 1,
        condition: {},
        ascs: [],
        descs: []
      };
      getmemberrule(data).then(res => {
        this.gradelevelOptions = res.records;
      });
    },
    //点击空白日期初始化
    focusPickerDate(){
      this.dataViewRange = "";
    },
    //点击头部时间选择切换为日期状态
    changeDataViewDate(){
      this.dataViewDate = "4";
      this.queryTradeOrderTotal();
    },
    /*头部看板*/
    queryTradeOrderTotal(){
      let beginDate = "";
      let endDate = "";
      if(this.dataViewDate == '4'&& this.dataViewRange != null && this.dataViewRange.length == 2){
        beginDate = this.dataViewRange[0];
        endDate = this.dataViewRange[1];
      }else{
        this.dataViewRange = "";
      }
      let data = {
        dataViewDate: this.dataViewDate,
        beginDate: beginDate,
        endDate: endDate,
        isReturn: 0,//退款订单为1，正常订单为0
        isCustomizeOrder: 0,//定制订单为1，普通订单为0
        shopId: this.formInline.shopId.trim(),
        warzoneId: this.formInline.warzoneId.trim(),
        baseId: this.formInline.baseId.trim()
      };
      queryTradeOrderTotal(data).then(res => {
        if(res != null){
          this.totalData.orderNum = res.result.orderNum;
          this.totalData.payOrderNum = res.result.payOrderNum + res.result.returnOrderNum;
          this.totalData.returnOrderNum = res.result.returnOrderNum;
          this.totalData.orderFinishNum = res.result.orderFinishNum;
          this.totalData.orderAcceptNum = res.result.orderAcceptNum;
          this.totalData.orderPostNum = res.result.orderPostNum;
          this.totalData.orderCancelNum = res.result.orderCancelNum;
          this.totalData.payMoney = (res.result.payMoney + res.result.returnMoney).toFixed(2);
          this.totalData.returnMoney = res.result.returnMoney.toFixed(2);
<<<<<<< HEAD
          this.totalData.payerNum = res.result.payerNum + res.result.returnerNum;
=======
          this.totalData.payerNum = res.result.allPayerNum;
>>>>>>> a866abc66d02e7ee0f708c9893d87e14024ef8fb
        }
      });
    },
    /*订单列表*/
    queryTradeOrderByParam() {
      let beginDate = "";
      let endDate = "";
      if(this.formInline.dateRange != null && this.formInline.dateRange.length == 2){
        beginDate = this.formInline.dateRange[0];
        endDate = this.formInline.dateRange[1];
      }else{
        this.formInline.dateRange = "";
      }
      let payBeginDate = "";
      let payEndDate = "";
      if(this.formInline.payDateRange != null && this.formInline.payDateRange.length == 2){
        payBeginDate = this.formInline.payDateRange[0];
        payEndDate = this.formInline.payDateRange[1];
      }else{
        this.formInline.payDateRange = "";
      }
      let fhBeginDate = "";
      let fhEndDate = "";
      if(this.formInline.fhDateRange != null && this.formInline.fhDateRange.length == 2){
        fhBeginDate = this.formInline.fhDateRange[0];
        fhEndDate = this.formInline.fhDateRange[1];
      }else{
        this.formInline.fhDateRange = "";
      }
      let data = {
        current: this.listQuery.current,
        size: this.listQuery.size,
        condition: {
          sortList: this.formInline.sortList,
          isReturn: 0,//退款订单为1，正常订单为0
          isCustomizeOrder: 0,//定制订单为1，普通订单为0
          orderNo: this.formInline.orderNo.trim(),
          companyName: this.formInline.companyName.trim(),
          orderStatus: this.formInline.orderStatus,
          returnStatus: this.formInline.returnStatus,
          customizeStatus: this.formInline.customizeStatus,
          beginDate: beginDate,
          endDate: endDate,
          payBeginDate: payBeginDate,
          payEndDate: payEndDate,
          fhBeginDate: fhBeginDate,
          fhEndDate: fhEndDate,
          shopId: this.formInline.shopId.trim(),
          storeName: this.formInline.storeName.trim(),
          shopOwnerName: this.formInline.shopOwnerName.trim(),
          warzoneId: this.formInline.warzoneId.trim(),
          warzoneName: this.formInline.warzoneName.trim(),
          baseId: this.formInline.baseId.trim(),
          baseName: this.formInline.baseName.trim(),
          gradelevelId: this.formInline.gradelevelId,
          memberName: this.formInline.memberName.trim(),
          memberPhone: this.formInline.memberPhone.trim(),
          goodsName: this.formInline.goodsName.trim(),
          payMethod: this.formInline.payMethod,
          deliveryMethod: this.formInline.deliveryMethod,
          authCode: this.formInline.authCode.trim(),
          isBuyLimit: this.formInline.isBuyLimit,
          isGiftOrder: this.formInline.isGiftOrder,
          isFeastOrder: this.formInline.isFeastOrder,
          goodsStyle: this.formInline.goodsStyle
        },
        ascs: [],
        descs: []
      };
      queryTradeOrderByParam(data).then(res => {
        this.dindanflag=false;
        this.dindanflagone=false
        this.loading = false;
        this.tableData = res.records;
        this.total = res.total;
      });
    },
    handleSizeChange(val) {
      this.listQuery.size = val;
    
      this.queryTradeOrderByParam();
    },
    handleCurrentChange(val) {
      this.listQuery.current = val;
        this.dindanflag=true
      this.queryTradeOrderByParam();
    },
    //查询
    search() {
      this.listQuery.current = 1;
      this.dindanflagone=true
      this.queryTradeOrderByParam();
    },
    //清空
    kong(){
      this.formInline.sortList = [];
      this.formInline.orderNo = "";
      this.formInline.orderStatus = "";
      this.formInline.companyName = "";
      this.formInline.returnStatus = "";
      this.formInline.customizeStatus = "";
      this.formInline.dateRange = "";
      this.formInline.payDateRange = "";
      this.formInline.fhDateRange = "";
      this.formInline.storeName = "";
      this.formInline.shopOwnerName = "";
      this.formInline.warzoneName = "";
      this.formInline.baseName = "";
      this.formInline.gradelevelId =  "";
      this.formInline.memberName =  "";
      this.formInline.memberPhone =  "";
      this.formInline.goodsName = "";
      this.formInline.payMethod = "";
      this.formInline.deliveryMethod = "";
      this.formInline.authCode = "";
      this.formInline.isBuyLimit = "";
      this.formInline.isGiftOrder = "";
      this.formInline.isFeastOrder = "";
      this.formInline.goodsStyle = "";
    },
    //全数据页面导出
    exportExcel1(){
      this.exportLoading = true;
      //获取数据
      let beginDate = "";
      let endDate = "";
      if(this.formInline.dateRange != null && this.formInline.dateRange.length == 2){
        beginDate = this.formInline.dateRange[0];
        endDate = this.formInline.dateRange[1];
      }else{
        this.formInline.dateRange = "";
      }
      let payBeginDate = "";
      let payEndDate = "";
      if(this.formInline.payDateRange != null && this.formInline.payDateRange.length == 2){
        payBeginDate = this.formInline.payDateRange[0];
        payEndDate = this.formInline.payDateRange[1];
      }else{
        this.formInline.payDateRange = "";
      }
      let fhBeginDate = "";
      let fhEndDate = "";
      if(this.formInline.fhDateRange != null && this.formInline.fhDateRange.length == 2){
        fhBeginDate = this.formInline.fhDateRange[0];
        fhEndDate = this.formInline.fhDateRange[1];
      }else{
        this.formInline.fhDateRange = "";
      }
      let data = {
        isReturn: 0,//退款订单为1，正常订单为0
        isCustomizeOrder: 0,//定制订单为1，普通订单为0
        orderNo: this.formInline.orderNo.trim(),
        orderStatus: this.formInline.orderStatus,
        companyName: this.formInline.companyName.trim(),
        returnStatus: this.formInline.returnStatus,
        customizeStatus: this.formInline.customizeStatus,
        beginDate: beginDate,
        endDate: endDate,
        payBeginDate: payBeginDate,
        payEndDate: payEndDate,
        fhBeginDate: fhBeginDate,
        fhEndDate: fhEndDate,
        shopId: this.formInline.shopId.trim(),
        storeName: this.formInline.storeName.trim(),
        shopOwnerName: this.formInline.shopOwnerName.trim(),
        warzoneId: this.formInline.warzoneId.trim(),
        warzoneName: this.formInline.warzoneName.trim(),
        baseId: this.formInline.baseId.trim(),
        baseName: this.formInline.baseName.trim(),
        gradelevelId: this.formInline.gradelevelId,
        memberName: this.formInline.memberName.trim(),
        memberPhone: this.formInline.memberPhone.trim(),
        goodsName: this.formInline.goodsName.trim(),
        payMethod: this.formInline.payMethod,
        deliveryMethod: this.formInline.deliveryMethod,
        authCode: this.formInline.authCode.trim(),
        isBuyLimit: this.formInline.isBuyLimit,
        isGiftOrder: this.formInline.isGiftOrder,
        isFeastOrder: this.formInline.isFeastOrder,
        goodsStyle: this.formInline.goodsStyle
      };
      queryTradeOrderByParamNoPage(data).then(res => {
        this.tableDataExcel = res.records;
        if(res.records == null || res.records.length == 0){
          this.$message.error("数据为空无法导出!");
          this.exportLoading = false;
          return;
        }else{
          //要导出去的标题
          var arry = [['订单编号','商品名称','商品数量','是否包含限购品','是否包含赠品','会员姓名','备注名称','会员等级','会员手机号','大区名称','营销区域名称','店铺名称','店铺授权码','店铺地址',
            '店主姓名','订单实付金额','下单时间','收货人姓名','收货人电话','收货地址','宴席信息','支付类型','订单来源','订单状态']];
          this.tableDataExcel.map((a,i) => {
            var _arry = [];
            _arry.push(a.orderNo == null ? "" : a.orderNo.toString());
            _arry.push(a.goodsNames == null ? "" : a.goodsNames.toString());
            _arry.push(a.totalAmount == null ? "" : a.totalAmount.toString());
            _arry.push(a.haveBuyLimitName == null ? "" : a.haveBuyLimitName.toString());
            _arry.push(a.haveGiftOrderName == null ? "" : a.haveGiftOrderName.toString());
            _arry.push(a.memberName == null ? "" : a.memberName.toString());
            _arry.push(a.nickName == null ? "" : a.nickName.toString());
            _arry.push(a.gradelevelName == null ? "" : a.gradelevelName.toString());
            _arry.push(a.memberPhone == null ? "" : a.memberPhone.toString());
            _arry.push(a.warzoneName == null ? "" : a.warzoneName.toString());
            _arry.push(a.baseName == null ? "" : a.baseName.toString());
            _arry.push(a.storeName == null ? "" : a.storeName.toString());
            _arry.push(a.authCode == null ? "" : a.authCode.toString());
            _arry.push(a.storeAddress == null ? "" : a.storeAddress.toString());
            _arry.push(a.shopOwnerName == null ? "" : a.shopOwnerName.toString());
            _arry.push(a.receivedMoney == null ? 0.00 : a.receivedMoney.toFixed(2));
            _arry.push(a.orderTime == null ? "" : a.orderTime.toString());
            _arry.push(a.postPerson == null ? "" : a.postPerson.toString());
            _arry.push(a.postPersonTel == null ? "" : a.postPersonTel.toString());
            _arry.push(a.postAddress == null ? "" : a.postAddress.toString());
            let feastInfo = null;
            if(a.feastList != null && a.feastList.length > 0){
              a.feastList.forEach((item,i) => {
                if(i == 0){
                  feastInfo = item.feastDate + "\r\n" + item.feastAddressDetail;
                }else{
                  feastInfo = "\r\n" + item.feastDate + "\r\n" + item.feastAddressDetail;
                } 
              });
            }
            _arry.push(feastInfo == null ? "无" : feastInfo);
            _arry.push(a.payMethodName == null ? "" : a.payMethodName.toString());
            _arry.push(a.orderSourceName == null ? "" : a.orderSourceName.toString());
            _arry.push(a.orderStatusName == null ? "" : a.orderStatusName.toString());
            return _arry;
          }).forEach(a => {
              arry.push(a);
          });
          var sheet = XLSX.utils.aoa_to_sheet(arry);        
          sheet["!cols"] = [{
              wpx: 150 //订单编号
          },{
              wpx: 150 //商品名称
          },{
              wpx: 100 //商品数量
          },{
              wpx: 150 //是否包含限购品
          },{
              wpx: 150 //是否包含赠品
          }, {
              wpx: 100//会员姓名
          }, {
              wpx: 100//备注名称
          }, {
              wpx: 120//会员等级
          }, {
              wpx: 120//会员手机号
          }, {
              wpx: 120//大区名称
          }, {
              wpx: 120//营销区域名称
          }, {
              wpx: 150//店铺名称
          }, {
              wpx: 150//店铺授权码
          }, {
              wpx: 150//店铺地址
          }, {
              wpx: 100//店主姓名
          }, {
              wpx: 120//订单实付金额
          }, {
              wpx: 180//下单时间
          }, {
              wpx: 100//收货人姓名
          }, {
              wpx: 150//收货人电话
          }, {
              wpx: 200//收货地址
          }, {
              wpx: 250//宴席信息
          }, {
              wpx: 150//支付类型
          }, {
              wpx: 150//订单来源
          }, {
              wpx: 150//订单状态
          }]; //单元格列宽
          this.exportLoading = false;
          this.openDownloadDialog(this.sheet2blob(sheet), new Date().toLocaleDateString() + '订单查询记录表.xlsx');
        }
      });
    },
    //流导出
    exportExcel(){
      let beginDate = "";
      let endDate = "";
      if(this.formInline.dateRange != null && this.formInline.dateRange.length == 2){
        beginDate = this.formInline.dateRange[0];
        endDate = this.formInline.dateRange[1];
      }else{
        this.formInline.dateRange = "";
      }
      let payBeginDate = "";
      let payEndDate = "";
      if(this.formInline.payDateRange != null && this.formInline.payDateRange.length == 2){
        payBeginDate = this.formInline.payDateRange[0];
        payEndDate = this.formInline.payDateRange[1];
      }else{
        this.formInline.payDateRange = "";
      }
      let fhBeginDate = "";
      let fhEndDate = "";
      if(this.formInline.fhDateRange != null && this.formInline.fhDateRange.length == 2){
        fhBeginDate = this.formInline.fhDateRange[0];
        fhEndDate = this.formInline.fhDateRange[1];
      }else{
        this.formInline.fhDateRange = "";
      }
      let data = {
        sortList: this.formInline.sortList,
        isReturn: 0,//退款订单为1，正常订单为0
        isCustomizeOrder: 0,//定制订单为1，普通订单为0
        orderNo: this.formInline.orderNo.trim(),
        orderStatus: this.formInline.orderStatus,
        companyName: this.formInline.companyName.trim(),
        returnStatus: this.formInline.returnStatus,
        customizeStatus: this.formInline.customizeStatus,
        beginDate: beginDate,
        endDate: endDate,
        payBeginDate: payBeginDate,
        payEndDate: payEndDate,
        fhBeginDate: fhBeginDate,
        fhEndDate: fhEndDate,
        shopId: this.formInline.shopId.trim(),
        storeName: this.formInline.storeName.trim(),
        shopOwnerName: this.formInline.shopOwnerName.trim(),
        warzoneId: this.formInline.warzoneId.trim(),
        warzoneName: this.formInline.warzoneName.trim(),
        baseId: this.formInline.baseId.trim(),
        baseName: this.formInline.baseName.trim(),
        gradelevelId: this.formInline.gradelevelId,
        memberName: this.formInline.memberName.trim(),
        memberPhone: this.formInline.memberPhone.trim(),
        goodsName: this.formInline.goodsName.trim(),
        payMethod: this.formInline.payMethod,
        deliveryMethod: this.formInline.deliveryMethod,
        authCode: this.formInline.authCode.trim(),
        isBuyLimit: this.formInline.isBuyLimit,
        isGiftOrder: this.formInline.isGiftOrder,
        isFeastOrder: this.formInline.isFeastOrder,
        goodsStyle: this.formInline.goodsStyle
      };
      this.exportLoading = true;
      excelTradeOrderByParam(data).then(res => {
        this.exportLoading = false;
        let blob = new Blob([res], {type: 'application/vnd.ms-excel'});
        const link = document.createElement('a');
        link.style = "display:none";
        link.href = URL.createObjectURL(blob);
        link.download = new Date().toLocaleDateString() + "普通订单查询记录表.xlsx";
        document.body.appendChild(link);
        link.click();
      });
    },
    //导出excel（分页）
    exportExcel2 () {
      /* generate workbook object from table */
      var head = document.querySelector('#rebateSetTable div.el-table__header-wrapper');
      var body = document.querySelector('#rebateSetTable div.el-table__body-wrapper');
      var all = document.createElement("div");
      all.appendChild(head.cloneNode(true));
      all.appendChild(body.cloneNode(true));
      let wb = XLSX.utils.table_to_book(all);
      /* get binary string as output */
      let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' });
      try {
          FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), '普通订单列表.xlsx');
      } catch (e)
      {
          if (typeof console !== 'undefined')
              console.log(e, wbout)
      }
      return wbout;
    },
    //数字格式化
    fixData(row, column, cellValue, index) {
      if (cellValue != null && !isNaN(cellValue)) {
        if(cellValue < 0){
          return "0.00";
        }else{
          return cellValue.toFixed(2);
        }
      } else {
        return cellValue;
      }
    },
    //查看订单详情（跳转）
    showOrderDetail(v){
      let orderSearchParam = {
        formInline: this.formInline,
        listQuery: this.listQuery,
        total: this.total
      };
      sessionStorage.setItem("pageFrom", "normalOrderSearch");
      sessionStorage.setItem("orderSearchParam", JSON.stringify(orderSearchParam));
      this.$router.push({
        name: "normalOrderDetail",
        params: {
          edit: v
        }
      });
    },
    //转下载文件
    sheet2blob(sheet, sheetName) {
      sheetName = sheetName || 'sheet1';
      var workbook = {
        SheetNames: [sheetName],
        Sheets: {}
      };
      workbook.Sheets[sheetName] = sheet;
      // 生成excel的配置项
      var wopts = {
        bookType: 'xlsx', // 要生成的文件类型
        bookSST: false, // 是否生成Shared String Table，官方解释是，如果开启生成速度会下降，但在低版本IOS设备上有更好的兼容性
        type: 'binary'
      };
      var wbout = XLSX.write(workbook, wopts);
      var blob = new Blob([s2ab(wbout)], {type:"application/octet-stream"});
      // 字符串转ArrayBuffer
      function s2ab(s) {
        var buf = new ArrayBuffer(s.length);
        var view = new Uint8Array(buf);
        for (var i=0; i!=s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
        return buf;
      }
      return blob;
    },
    //下载文件触发弹窗
    openDownloadDialog(url, saveName){
	    if(typeof url == 'object' && url instanceof Blob){
		    url = URL.createObjectURL(url); // 创建blob地址
	    }
	    var aLink = document.createElement('a');
	    aLink.href = url;
	    aLink.download = saveName || ''; // HTML5新增的属性，指定保存文件名，可以不要后缀，注意，file:///模式下不会生效
	    var event;
	    if(window.MouseEvent){
        event = new MouseEvent('click');
      }else{
		    event = document.createEvent('MouseEvents');
		    event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
	    }
	    aLink.dispatchEvent(event);
    },
    //显示配置弹窗
    showConfigTableDialog(){
      this.userMenuShowFields = this.userOldMenuShowFields;
      let checkedCount = this.userMenuShowFields.length;
      this.formInline2.isAll = checkedCount === this.userMenuAllFields.length;
      this.formInline2.isIndeterminate = checkedCount > 0 && checkedCount < this.userMenuAllFields.length;
      this.configTableDialogVisible = true;
    },
    //关闭配置弹窗
    closeConfigTableDialog(){
      this.configTableDialogVisible = false;
      let data = { 
        menuCode: this.formInline2.menuCode 
      };
    },
    queryUserMenuFieldByParam(){
      let data = { 
        menuCode: this.formInline2.menuCode 
      };
      this.userMenuAllFields = [];//全部的列名
      this.userMenuShowFields = [];//显示的列名
      queryUserMenuFieldByParam(data).then(res => {
        this.userMenuFieldList = res.records;
        this.userMenuFieldList.forEach((item, index) => {
          this.userMenuAllFields.push(item.fieldCode);
          if(item.isShow == 1){
            this.userMenuShowFields.push(item.fieldCode);
          }        
        });
        if(this.userMenuShowFields.length == 0 || this.userMenuShowFields.length == this.userMenuAllFields.length){
          this.userMenuShowFields = this.userMenuAllFields;
          this.formInline2.isAll = true;
        }else{
          this.formInline2.isAll = false;
          this.formInline2.isIndeterminate = true;
        }
        this.insertUserFieldRelation(1);
      });
    },
    getNewCol(){
      let data = { 
        menuCode: this.formInline2.menuCode 
      };
      this.col = [];
      this.dropCol = [];
      queryUserMenuFieldByParam(data).then(res => {
        this.userMenuFieldList = res.records;
        this.userMenuFieldList.forEach((item, index) => {
          if(item.isShow == 1){
            this.col.push({label:item.fieldName, prop:item.fieldCode});
            this.dropCol.push({label:item.fieldName, prop:item.fieldCode});
          }     
        });
        if(this.col.length == 0){
          this.col = this.allCol;
          this.dropCol = this.allCol;
          this.formInline2.isAll = true;
        }
        this.col.forEach((item, index) => {
          if(item.prop == "totalAmount"){
            this.$set(item,'sortable','totalAmount')
          }else if(item.prop == "payMoney"){
            this.$set(item,'sortable','payMoney')
          }else if(item.prop == "orderTime"){
            this.$set(item,'sortable','orderTime')
          }
        });
      });
    },
    //保存显示字段
    insertUserFieldRelation(isInit){
      if(this.userMenuShowFields == null || this.userMenuShowFields.length == 0){
        this.$message({showClose: true, message: "列表字段不可为空",type: "info"});
        return;
      }
      let data = {
        menuCode: this.formInline2.menuCode,
        fieldList: this.userMenuShowFields
      };
      if(isInit == 1){
        insertUserFieldRelation(data).then(res => {
          if(res.code == 1){
            this.userOldMenuShowFields = this.userMenuShowFields;
            this.closeConfigTableDialog();
            this.getNewCol();
          }  
        });  
        return;
      }
      this.insertLoading = true;
      insertUserFieldRelation(data).then(res => {
        this.insertLoading = false;
        if(res.code == 1){
            this.$message({
            showClose: true,
            message: res.message,
            type: "success"
          });
          this.userOldMenuShowFields = this.userMenuShowFields;
          this.closeConfigTableDialog();
          this.getNewCol();
        }else{
          this.$message({
            showClose: true,
            message: res.message,
            type: "error"
          });
        }
      });
    },
    //是否全选字段
    isAllFieldChange(val){
      this.userMenuShowFields = val ? this.userMenuAllFields : [];
      this.formInline2.isIndeterminate = false;
    },
    //是否选中单个字段
    isSingleFieldChange(val){
      let checkedCount = this.userMenuShowFields.length;
      this.formInline2.isAll = checkedCount === this.userMenuAllFields.length;
      this.formInline2.isIndeterminate = checkedCount > 0 && checkedCount < this.userMenuAllFields.length;
    },
    //获取字段勾选状态
    getUserMenuFieldStatus(fieldCode){
      if(this.userMenuShowFields != null){
        for (let i = 0; i < this.userMenuShowFields.length; i++) {
          if(this.userMenuShowFields[i] == fieldCode){
            return true;
          }
        }
        return false;
      }
    },
    //是否显示字段
    isShow(fieldCode){
      if(this.formInline2.isAll || this.getUserMenuFieldStatus(fieldCode)){
        return true;
      }else{
        return false;
      }
    },
    //显示上传弹窗
    showGoodsPicDialog(v){
      this.picList = v.picList == null ? [] : v.picList;
      this.goodsPicDialoVisible = true;
    },
    //预览图片
    handlePreview(url) {
      this.dialogImageUrl = url;
      this.dialogVisibleImg = true;
    },
    handleSort(val) {
      let sortModel = "";
      if (val.order === "ascending") {
        sortModel = "ASC";
        if(val.prop == "totalAmount"){
          this.formInline.sortList = [{"sort":"asc","sortField":"totalAmount"}];
          this.search();
        }
        if(val.prop == "payMoney"){
          this.formInline.sortList = [{"sort":"asc","sortField":"payMoney"}];
          this.search();
        }
        if(val.prop == "orderTime"){
          this.formInline.sortList = [{"sort":"asc","sortField":"orderTime"}];
          this.search();
        }
      } else if (val.order === "descending") {
        sortModel = "DESC";
        if(val.prop == "totalAmount"){
          this.formInline.sortList = [{"sort":"desc","sortField":"totalAmount"}];
          this.search();
        }
        if(val.prop == "payMoney"){
          this.formInline.sortList = [{"sort":"desc","sortField":"payMoney"}];
          this.search();
        }
        if(val.prop == "orderTime"){
          this.formInline.sortList = [{"sort":"desc","sortField":"orderTime"}];
          this.search();
        }
      }
    },
  },
  //其他
  computed: {
    
  }
};
</script>
<style scoped>
#orderSearchDiv /deep/ .el-radio-button-inner-datepicker .el-radio-button__inner {
    padding: 0;
}
#orderSearchDiv /deep/ .el-radio-button-inner-datepicker .el-input__inner {
    border: none;
    height: 38px;
}
#orderSearchDiv /deep/ #orderSearchForm {
    margin-left: -30px;
    padding: 0;
    display: inline-block;
    text-align: left;
}
#orderSearchDiv /deep/ .el-form--inline .el-form-item__content {
    width: 180px;
}
#orderSearchDiv /deep/ .el-range-editor.el-input__inner {
    width: 250px;
}
#orderSearchDiv /deep/ .el-dialog__body {
    padding-top: 0;
}
#order_total_flex {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
}
#order_total_flex /deep/ .order_content {
    cursor: pointer;
    width: 200px;
    padding: 20px 0;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}
#order_total_flex /deep/ .order_detail {
    width: 200px;
    margin-top: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}
#order_total_flex /deep/ .order_content2 {
    width: 60px;
    cursor: pointer;
    padding: 10px 0;
    margin: 0 1px;
    text-align: center;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}
#order_total_flex /deep/ .order_content .order_total_title {
    color: #000;
}
#order_total_flex /deep/ .order_content .order_total_info {
    margin-top: 10px;
}
#order_total_flex /deep/ .order_content .order_data {
    font-size: 1.4em;
    font-weight: bold;
}
#configTableDiv /deep/ .el-divider--horizontal {
    margin-top: 0;
}
</style>